 /*
    create 2018-05-29
    客户案例 页面样式
 */
 .marketlayer{
     padding-top: 33px;
     min-height: 720px;
 }
 .topnav{
     position: relative;
     padding-bottom: 16px;
     -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
     box-sizing: content-box;
 }
 .topnav .backbtn{
     position: absolute;
     right: 20px;
     top: 0px;
 }
 .backbtn a{
     color: #FF6666;
 }
.company-list>ul>li>div.company-detailsbox{
    display: block;
    width: 100%;
    height: 209px;
    padding:30px 0px 29px 0px;
    border-bottom: 1px solid #f0f3f5;
    box-sizing: border-box;
}
.company-detailsbox a{
    display: block;
    width: 100%;
    height: 100%;
}
.company-video,.company-msg{
    position: relative;
    float: left;
    cursor: pointer;
}
 .company-video{
     overflow: hidden;
 }
.playbtn{
    position: absolute;
    left: 50%;
    top: 45px;
    margin-left: -30px;
    width: 60px;
    height: 60px;
    background: url("../images/clients_sprite_img.png") no-repeat -10px -10px;
    z-index: 10;
}
.company-video{
    width: 200px;
    height: 100%;
}
.company-video a{
    display: block;
    width: 200px;
    height: 100%;
}
 .company-video a img{
     width: 100%;
     height: 100%;
 }
.company-msg{
    width: 1000px;
    height: 100%;
    padding-left: 40px;
}
.company-name{
    height: 33px;
    line-height: 33px;
    font-size: 17px;
    color: #2d3137;
    margin-top: 2px;
}
.user-msg{
    line-height: 24px;
    font-size: 12px;
    color: #9da9b4;
}
.firstspan{
    margin-right: 24px;
}
.yisu-text{
    height: 34px;
    line-height: 34px;
    font-size: 14px;
    color: #5e6e82;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}
 .server-list{
     margin-top: 4px;
     line-height: 30px;
 }
.server-list div{
    display: inline-block;
    vertical-align: middle;
}
.server-list-text{
    font-size: 14px;
    color: #5e6e82;
}
 .server-list-item ul li{
     float: left;
     margin-right: 30px;
 }
.server-list-item ul li div{
    font-size: 14px;
    color: #FF6666;
}
.product-img{
    width: 18px;
    height: 18px;
    /*-webkit-border-radius: 50%;*/
    /*-moz-border-radius: 50%;*/
    /*border-radius: 50%;*/
    vertical-align: middle;
    margin-right: 6px;
}
.cloud-sprite{
    background: url("../images/clients_sprite_img.png") no-repeat -80px -10px;
}
.high-sprite{
    background: url("../images/clients_sprite_img.png") no-repeat -80px -38px;
}
.Korea-sprite{
    background: url("../images/clients_sprite_img.png") no-repeat -80px -66px;
}
.usa-sprite{
    background: url("../images/clients_sprite_img.png") no-repeat -108px -10px;
}
.hk-sprite{
    background: url("../images/clients_sprite_img.png") no-repeat -108px -38px;
}
.physics-sprite{
    background: url("../images/clients_sprite_img.png") no-repeat -108px -66px;
}
.defense-sprite{
    background: url("../images/clients_sprite_img.png") no-repeat -136px -10px;
}
.mix-sprite{
    background: url("../images/clients_sprite_img.png") no-repeat -136px -38px;
}
.special-sprite{
    background: url("../images/clients_sprite_img.png") no-repeat -136px -66px;
}


/*视屏播放弹窗样式*/
 /*.shadow{*/
     /*position: fixed;*/
     /*left: 0px;*/
     /*top: 0px;*/
     /*width: 100%;*/
     /*height: 100%;*/
     /*background: rgba(255,255,255,.6);*/
     /*z-index: 1000;*/
     /*display: none;*/
 /*}*/
 /*.playnow{*/
     /*position:absolute;*/
     /*left: 50%;*/
     /*top: 50%;*/
     /*margin-left: -410px;*/
     /*margin-top: -286px;*/
     /*width: 820px;*/
     /*height: 550px;*/
     /*background-color: #fff;*/
     /*z-index: 1000;*/
     /*padding: 10px 0px;*/
     /*box-shadow: 0 5px 15px rgba(0,0,0,.5);*/
 /*}*/
 /*.playnow .show-video{*/
     /*padding:0px 10px;*/
     /*text-align: center;*/
     /*line-height: 500px;*/
 /*}*/
 /*.closevideo{*/
     /*height: 30px;*/
     /*line-height: 20px;*/
     /*font-size: 20px;*/
     /*color: #767676;*/
     /*text-align: right;*/
     /*cursor: pointer;*/
     /*border-bottom:1px solid #ccc;*/
 /*}*/
 /*.closevideo:hover{*/
     /*color: #333;*/
 /*}*/
 /*.closevideo span{*/
     /*margin-right: 10px;*/
 /*}*/

 /*========================================用户公司详情页样式  clientsdetails.html =================================================*/
.clients{
    border-bottom: 1px solid #f0f3f5;
}
.company-details>div{
    float: left;
}
.details-left{
    width: 300px;
}
.details-right{
    width: 900px;
}
.company-logo{
    width: 100%;
    height: 254px;
    background-color: yellowgreen;
}
.company-server{
    width: 100%;
    background-color: #f6f9f9;
    padding: 12px 0px 30px 30px;
}
.company-title{
    height: 55px;
    line-height: 55px;
    font-size: 17px;
    color: #2d3137;
}
.company-desmsg ul li,.useproduct-title{
    height: 30px;
    line-height: 30px;
    color: #5c6f82;
}
.useproduct-title{

 }
.useproduct-list>div{
    float: left;
}
.useproduct-item{
    padding-top: 10px;
}
.useproduct-item ul li{
    position: relative;
    height: 17px;
    line-height: 17px;
    padding-left: 27px;
    margin-bottom: 13px;
}
.use-img{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 18px;
    height: 18px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.use-name{
    line-height: 18px;
    font-size: 14px;
    color: #FF6666;
}
.details-right{
    padding: 16px 0px 0px 50px;
}
.right-title{
    height: 70px;
    line-height: 70px;
    font-size: 23px;
    color: #2d3137;
    border-bottom: 1px solid #f0f3f5;
}
.right-text{
    padding-top: 14px;
}
.right-text p{
    line-height: 38px;
    font-size: 16px;
    color: #2d3137;
}
.right-movie{
    margin-top: 52px;
}
.right-movie video{
    width: 100%;
    height: 478px;
}
.congratulate-box{
    margin-top: 62px;
}
.congratulate-title{
    height: 71px;
    line-height: 71px;
    font-size: 23px;
    color: #2d3137;
    border-bottom: 1px solid #f0f3f5;
}
.congratulate-text{
    padding:13px 0px;
}
.congratulate-text p{
    line-height: 36px;
    font-size: 16px;
    color: #2d3137;
}


/*视频播放完*/
 .play_over{
     position: absolute;
     left: 0px;
     top: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0,0,0,.9);
     padding:38px 101px 0px;
     display: none;
     opacity: 0;
 }
 .close_over{
     position: absolute;
     right: 5px;
     top: 5px;
     width: 32px;
     height: 32px;
     background: url("../images/close_over_01.png") no-repeat center;
     cursor: pointer;
 }
 .close_over:hover{
     background: url("../images/close_over_02.png") no-repeat center;
 }
 .over_head{
     line-height: 95px;
     font-size: 23px;
     color: #ffffff;
 }
 .over_head>a{
     float: right;
     font-size: 14px;
     color: #ffffff;
 }
 .over_head>a span{
     display: inline-block;
     width: 16px;
     height: 16px;
     vertical-align: middle;
     margin-right: 6px;
 }
 .over_body a{
     position: relative;
     float: left;
     width: 296px;
     height: 166px;
     background-color: #23252b;
     background-repeat: no-repeat;
     background-position: center;
     -webkit-background-size: 100% 100%;
     background-size: 100% 100%;
     border: 1px solid #23252b;
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     border-radius: 3px;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
     -webkit-transition: all .4s;
     -moz-transition: all .4s;
     -ms-transition: all .4s;
     -o-transition: all .4s;
     transition: all .4s;
     margin-bottom: 24px;
     cursor: pointer;
 }
 .over_body a:nth-child(odd){
     margin-right: 26px;
 }
 .over_body a:hover{
     border-color: #ffffff;
 }
 .body_company_name{
     position: absolute;
     left: 0px;
     bottom: 0px;
     line-height: 52px;
     font-size: 16px;
     color: #ffffff;
     padding-left: 18px;
 }
 .over_bottom{
     position: relative;
     width: 100%;
     height: 8px;
 }
 .bottom_circle{
     position: absolute;
     left: 50%;
     top: 0px;
     margin-left: -22px;
     width: 44px;
     height: 8px;
 }
 .bottom_circle  span{
     float: left;
     width: 8px;
     height: 8px;
     background-color: #47494c;
     -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
     border-radius: 50%;
     margin-left: 10px;
 }
 .bottom_circle  span:first-child{
     margin-left: 0px;
 }
 .bottom_circle  span:nth-child(1){
     background-color: #fff;
 }


 /*视屏播放弹窗样式*/
 .shadow{
     position: fixed;
     left: 0px;
     top: 0px;
     width: 100%;
     height: 100%;
     background: rgba(0,0,0,.5);
     z-index: 1000;
     display: none;
 }
 .playnow{
     position:absolute;
     left: 50%;
     top: 50%;
     margin-left: -410px;
     margin-top: -286px;
     width: 820px;
     height: 550px;
     background-color: transparent;
     z-index: 1000;
 }
 .video_control{
     width: 820px;
     height: 500px;
     box-shadow: 0px 0px 20px 3px rgba(0,0,0,.5);
 }
 .video_control video{
     width: 100%;
     height: 100%;
     object-fit: fill;
 }
 /*.shadow{*/
     /*position: fixed;*/
     /*left: 0px;*/
     /*top: 0px;*/
     /*width: 100%;*/
     /*height: 100%;*/
     /*background: rgba(0,0,0,.5);*/
     /*z-index: 1000;*/
     /*display: none;*/
 /*}*/
 /*.playnow{*/
     /*position:absolute;*/
     /*left: 50%;*/
     /*top: 50%;*/
     /*margin-left: -410px;*/
     /*margin-top: -286px;*/
     /*width: 820px;*/
     /*height: 550px;*/
     /*!*background-color: transparent;*!*/
     /*z-index: 1000;*/
 /*}*/
 /*.video_control{*/
     /*width: 820px;*/
     /*height: 510px;*/
     /*box-shadow: 0px 0px 20px 3px rgba(0,0,0,.5);*/
 /*}*/
 /*.video_control video{*/
     /*width: 100%;*/
     /*height: 100%;*/
     /*object-fit: fill;*/
 /*}*/

 .nan_video{
     width: 100%;
     height: 650px;
 }
 .nan_video video{
     width: 100%;
     height: 650px;
 }
 .video_list{
     padding:86px 0px 102px 0px;
     background-color: #fff;
 }
 .video_list_content{
     width: 1200px;
     text-align: center;
     margin: 0 auto;
 }
 .video_list-title{
     line-height: 84px;
     font-size: 36px;
     color: #2d3137;
 }
 .video_list_kind{
     display: flex;
     justify-content: space-between;
     width: 790px;
     height: 144px;
     padding:52px 0px;
     margin: 0 auto;
 }
 .video_list_kind a{
     display: block;
     width: 98px;
     height: 38px;
     line-height: 38px;
     font-size: 17px;
     text-align: center;
     color: #5E6D81;
     border: 1px solid transparent;
     -webkit-border-radius: 19px;
     -moz-border-radius: 19px;
     border-radius: 19px;
     -webkit-transition: all .4s;
     -moz-transition: all .4s;
     -ms-transition: all .4s;
     -o-transition: all .4s;
     transition: all .4s;
 }
 .video_list_kind a.selected{
     color: #ff6666;
     border-color: #ff6666;
 }
 .video_list_look{
     margin-top: 10px;
 }
 .video_list_look ul li{
     float: left;
     width: 380px;
     height: 298px;
     margin:0px 30px 62px 0px;
     cursor: pointer;
 }
 .video_list_item{
     -webkit-transition: all .4s;
     -moz-transition: all .4s;
     -ms-transition: all .4s;
     -o-transition: all .4s;
     transition: all .4s;
 }
 .video_list_item:hover{
     -webkit-box-shadow: 0px 0px 20px 5px #f3f3f3;
     -moz-box-shadow: 0px 0px 20px 5px #f3f3f3;
     box-shadow: 0px 0px 20px 5px #f3f3f3;
     margin-top: -10px;
 }

 .video_list_look ul li:nth-child(3n){
     margin-right: 0px;
 }
 .video_list_item>div{
     position: relative;
     width: 380px;
     height: 214px;
     overflow: hidden;
 }
 .video_list_item>div .playbtn{
     position: absolute;
     left: 50%;
     top: inherit;
     bottom: 77px;
     margin-left: -30px;
     width: 60px;
     height: 60px;
     background: url(../images/clients_sprite_img.png) no-repeat -10px -10px;
     opacity: 0;
     -webkit-transition: all .4s;
     -moz-transition: all .4s;
     -ms-transition: all .4s;
     -o-transition: all .4s;
     transition: all .4s;
     z-index: 10;
 }
 .video_list_item:hover div .playbtn{
     opacity: 1;
 }
 .video_list_look ul li a{
     display: block;
     margin-top: 12px;
 }
 .video_list_look ul li a div{
     line-height: 34px;
     font-size: 18px;
     color: #2d3137;
 }
 .video_list_look ul li a p{
     line-height: 28px;
     font-size: 14px;
     color: #5E6D81;
     padding-bottom: 10px;
 }
 .video_list_more a{
     display: block;
     width: 188px;
     height: 44px;
     line-height: 44px;
     text-align: center;
     font-size: 17px;
     color: #ff6666;
     border: 1px solid #ff6666;
     -webkit-border-radius: 22px;
     -moz-border-radius: 22px;
     border-radius: 22px;
     -webkit-transition: all .4s;
     -moz-transition: all .4s;
     -ms-transition: all .4s;
     -o-transition: all .4s;
     transition: all .4s;
     margin: 0 auto;
 }
 .video_list_more a:hover{
     color: #ffffff;
     background-color: #ff6666;
 }
 .video_list_more a span{
     display: inline-block;
     width: 20px;
     height: 11px;
     background: url(../images/clients_sprite_img.png) no-repeat -10px -80px;
     margin-left: 10px;
 }
 .video_list_more a:hover span{
     background: url(../images/clients_sprite_img.png) no-repeat -40px -80px;
 }













